<template>
  <div style="display: flex">
    <div class="treeBox">
      <el-tree
        :data="Treedata"
        accordion
        :props="defaultProps"
        highlight-current
        @node-click="handleNodeClick"
      >
      </el-tree>
    </div>
    <div class="app-container" style="width: 85%">
      <!-- 查询表单区域 -->
      <el-form :inline="true" :model="examForm" class="demo-form-inline">
        <el-form-item label="考试期次">
          <el-input
            v-model="examForm.periodTime"
            placeholder="考试期次"
          ></el-input>
        </el-form-item>
        <el-form-item label="考试名称">
          <el-input v-model="examForm.name" placeholder="考试名称"></el-input>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="onSubmit">查询</el-button>
          <el-button type="info" @click="onclear">重置</el-button>
        </el-form-item>
      </el-form>

      <!-- 新增考试按钮 -->
      <div class="addExam">
        <el-button type="primary" @click="addExam()">新增考试</el-button>
      </div>

      <!-- 考试列表 -->
      <el-table ref="multipleTable" :data="examData">
        <el-table-column type="selection" width="55"></el-table-column>

        <el-table-column
          label="序号"
          align="center"
          :show-overflow-tooltip="true"
          prop="id"
          width="50"
        ></el-table-column>

        <el-table-column
          prop="periodTime"
          align="center"
          :show-overflow-tooltip="true"
          label="考试期次"
        ></el-table-column>

        <el-table-column
          prop="name"
          align="center"
          :show-overflow-tooltip="true"
          label="考试名称"
        ></el-table-column>

        <el-table-column
          prop="time"
          align="center"
          :show-overflow-tooltip="true"
          label="考试时间"
        ></el-table-column>

        <el-table-column
          prop="number"
          align="center"
          :show-overflow-tooltip="true"
          label="考试人数"
        ></el-table-column>

        <el-table-column
          prop="approvalStatus"
          align="center"
          :show-overflow-tooltip="true"
          label="审批状态"
        ></el-table-column>

        <el-table-column
          prop="examStatus"
          align="center"
          :show-overflow-tooltip="true"
          label="开考状态"
          width="120"
        ></el-table-column>

        <el-table-column
          label="操作"
          align="center"
          :show-overflow-tooltip="true"
          width="250"
        >
          <template slot-scope="scope">
            <!-- 暂时注释修改功能 -->
            <!-- <el-button
            type="text"
            icon="el-icon-edit"
            size="mini"
            @click="changeExame(scope.row)"
            >修改</el-button
          > -->
            <el-button
              type="text"
              icon="el-icon-delete"
              size="mini"
              @click="deleExame(scope.row)"
              >删除</el-button
            >
            <el-button
              type="text"
              icon="el-icon-share"
              size="mini"
              @click="showExame(scope.row)"
              >详情</el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <!-- 分页功能 -->
      <div style="margin: 40px auto 0">
        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="examForm.pageNum"
          :limit.sync="examForm.pageSize"
          @pagination="getList"
        />
      </div>
      <!-- 预览考试详情 -->
      <el-dialog
        :visible.sync="showDialogVisible"
        :loading="loading"
        width="80%"
        :before-close="handleClose"
      >
        <show :row="row" v-if="showDialogVisible"></show>
      </el-dialog>
      <!-- 新增考试的弹出框 -->
      <el-dialog
        :title="DialogVisibleTitle"
        :visible.sync="addDialogVisible"
        :loading="loading"
        width="80%"
        :before-close="handleClose"
      >
        <!-- 步骤条 -->
        <div>
          <el-steps :active="addActive" align-center finish-status="success">
            <el-step title="考试安排" description></el-step>
            <el-step title="场次安排" description></el-step>
            <el-step title="提交" description></el-step>
          </el-steps>
          <!-- 以下为考试安排的基本信息 -->
          <div>
            <div style="width: 50%; margin: 20px auto">{{ addText }}</div>

            <el-form
              label-width="100px"
              ref="addForm"
              :rules="rules"
              :model="addForm"
              style="width: 50%; margin: 0 auto"
            >
              <div v-show="addActive === 0">
                <el-form-item label="课程名称" prop="courseId">
                  <el-select
                    v-model="addForm.courseId"
                    placeholder="请选择课程"
                  >
                    <el-option
                      v-for="item in courseList"
                      :key="item.id"
                      :label="item.courseName"
                      :value="item.id"
                    ></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="考试名称" prop="name">
                  <el-input
                    v-model="addForm.name"
                    placeholder="请输入考试名称"
                  ></el-input>
                </el-form-item>
                <el-form-item label="延时口令" prop="examPwd">
                  <el-input
                    v-model="addForm.examPwd"
                    placeholder="请输入延时口令"
                  ></el-input>
                </el-form-item>
                <el-form-item label="考试时长" prop="examDuration">
                  <el-input
                    type="number"
                    v-model="addForm.examDuration"
                    placeholder="单位：（分钟）"
                  ></el-input>
                </el-form-item>
                <el-form-item label="交卷限制" prop="submitLimit">
                  <el-input
                    type="number"
                    v-model="addForm.submitLimit"
                    placeholder="单位：（分钟）"
                  ></el-input>
                </el-form-item>
                <el-form-item label="及格分数" prop="passingScore">
                  <el-input
                    type="number"
                    v-model="addForm.passingScore"
                    placeholder="请输入及格分数"
                  ></el-input>
                </el-form-item>
                <el-form-item label="考试类型" prop="examType">
                  <el-select
                    v-model="addForm.examType"
                    placeholder="请选择考试类型"
                    filterable
                  >
                    <el-option
                      v-for="dict in examTypeOptions"
                      :key="dict.dictValue"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                    ></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="考试性质" prop="examNature">
                  <el-select
                    v-model="addForm.examNature"
                    placeholder="请选择考试性质"
                  >
                    <el-option
                      v-for="dict in examQuelityOptions"
                      :key="dict.dictValue"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                    ></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="考试说明" prop="examExplain">
                  <el-input
                    type="textarea"
                    v-model="addForm.examExplain"
                    placeholder="请输入考试说明"
                  ></el-input>
                </el-form-item>
                <!-- <el-form-item label="使用试卷">
                      <el-select v-model="addForm.paper" placeholder="请选择">
                        <el-option
                          v-for="item in paperOptions"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value">
                        </el-option>
                      </el-select>
              </el-form-item>-->
              </div>

              <div v-show="addActive === 1">
                <el-form-item label="场次数量">
                  <div style="display: flex">
                    <el-input
                      type="text"
                      v-model="num1"
                      disabled
                      style="width: 40%; margin-right: 10px"
                    />
                    <el-button
                      @click="addsessionList"
                      type="primary"
                      size="mini"
                      round
                      style="font-size: 18px"
                      icon="el-icon-plus
"
                    ></el-button>
                  </div>
                </el-form-item>
                <!-- <div v-for="count in num1" :key="count" class="bac"> -->
                <div
                  v-for="(item, i) in addForm.sessionList"
                  :key="i"
                  class="bac"
                >
                  <el-form-item
                    label="场次名称"
                    :prop="addForm.sessionList[i].name"
                  >
                    <el-input
                      v-model="item.name"
                      @input="sessionListname(i, item.name)"
                      placeholder="请输入场次名称"
                      style="width: 90%"
                    ></el-input>
                  </el-form-item>

                  <el-form-item label="考试场地">
                    <el-collapse style="width: 90%">
                      <el-collapse-item title=" 点击展开">
                        <el-checkbox
                          style="margin-left: 5px; margin-right: 5px"
                          :min="0"
                          :indeterminate="item.isIndeterminate"
                          v-model="item.checkAll"
                          @change="handleCheckAllChange(i)"
                          >全选</el-checkbox
                        >
                        <div style="margin: 15px 0"></div>
                        <el-checkbox-group
                          style="margin-left: 5px; margin-right: 5px"
                          v-model="item.addressList"
                          @change="
                            handleCheckedCitiesChange(item.addressList, i)
                          "
                        >
                          <el-checkbox
                            v-for="(item2, i2) in cityOptions"
                            :label="item2"
                            :key="i2"
                            >{{ item2.name }}</el-checkbox
                          >
                        </el-checkbox-group>
                      </el-collapse-item>
                    </el-collapse>
                  </el-form-item>

                  <el-form-item label="开始时间">
                    <div class="block">
                      <el-date-picker
                        v-model="item.startTime"
                        type="datetime"
                        value-format="yyyy-MM-dd HH:mm:ss"
                        @input="timechange(i)"
                        placeholder="选择日期时间"
                      ></el-date-picker>
                    </div>
                  </el-form-item>
                  <el-form-item label="结束时间">
                    <div class="block">
                      <el-date-picker
                        v-model="item.endTime"
                        value-format="yyyy-MM-dd HH:mm:ss"
                        type="datetime"
                        disabled
                        placeholder="选择日期时间"
                      ></el-date-picker>
                    </div>
                  </el-form-item>

                  <el-form-item label="是否自动组卷" prop="flag">
                    <el-select
                      v-model="addForm.sessionList[i].flag"
                      clearable
                      placeholder="请选择"
                      style="width: 80%"
                    >
                      <!-- @change="flagChange(i)" -->
                      <el-option
                        v-for="volitem in volumeOption"
                        :key="volitem.value"
                        :label="volitem.label"
                        :value="volitem.value"
                      >
                      </el-option>
                    </el-select>
                  </el-form-item>

                  <div v-show="addForm.sessionList[i].flag">
                    <el-form-item label="自动组卷模板" prop="paperTemplateId">
                      <el-select
                        v-model="addForm.sessionList[i].autoTempId"
                        placeholder="请选择试卷模板"
                        @change="forceauto(i)"
                        clearable
                        :style="{ width: '80%' }"
                      >
                        <el-option
                          v-for="(item, index) in autoTempOptions"
                          :key="index"
                          :label="item.autoName"
                          :value="item.id"
                          :disabled="item.disabled"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label="试卷分类" prop="paperTypeId">
                      <el-input
                        v-model="addForm.sessionList[i].paperTypeName"
                        placeholder="请选择试卷分类"
                        clearable
                        :style="{ width: '80%' }"
                        @focus="paperType(i)"
                      ></el-input>
                    </el-form-item>

                    <el-form-item label="所属卷库">
                      <el-input
                        v-model="addForm.sessionList[i].volumeLibraryName"
                        placeholder="请选择所属卷库"
                        clearable
                        :style="{ width: '80%' }"
                        @focus="volume(i)"
                        @change="forceauto(i)"
                      ></el-input>
                      <!-- <input v-model="item.volumeLibraryId"/> -->
                    </el-form-item>
                    <el-form-item label="组卷数量">
                      <el-input
                        v-model="addForm.sessionList[i].count"
                        placeholder="请输入组卷数量"
                        clearable
                        :style="{ width: '80%' }"
                        @input="forceauto(i)"
                      ></el-input>
                      <!-- <input v-model="item.count"  /> -->
                    </el-form-item>
                  </div>

                  <el-form-item label="删除">
                    <el-button
                      @click="delsessionList(i)"
                      type="warning"
                      size="mini"
                      round
                      style="font-size: 18px; margin-bottom: 20px"
                      icon="el-icon-delete
"
                    ></el-button>
                  </el-form-item>
                </div>
              </div>
            </el-form>
          </div>
        </div>
        <div class="neper">
          <el-button
            style="margin-top: 12px; margin-right: 10px"
            v-show="addActive > 0"
            @click="addper"
            type="primary"
            >上一步</el-button
          >
          <el-button
            style="margin-top: 12px; margin-left: 10px"
            v-show="addActive < 2"
            @click="addnext"
            type="primary"
            >下一步</el-button
          >
        </div>

        <span slot="footer" class="dialog-footer" v-show="addActive == 2">
          <el-button @click="addDialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="handDialog(), (addActive = 0)"
            >确 定</el-button
          >
        </span>

        <el-dialog
          width="80%"
          title="请选择所属卷库"
          :visible.sync="volumeVisible"
          append-to-body
        >
          <div class="app-container">
            <el-form
              :model="vqueryParams"
              ref="vqueryForm"
              :inline="true"
              v-show="vshowSearch"
              label-width="68px"
            >
              <el-form-item label="课程关联id" prop="courseId">
                <el-input
                  v-model="vqueryParams.courseId"
                  placeholder="请输入课程关联id"
                  clearable
                  size="small"
                />
              </el-form-item>
              <el-form-item label="卷库名称" prop="name">
                <el-input
                  v-model="vqueryParams.name"
                  placeholder="请输入卷库名称"
                  clearable
                  size="small"
                />
              </el-form-item>
              <el-form-item label="卷库编号" prop="code">
                <el-input
                  v-model="vqueryParams.code"
                  placeholder="请输入卷库编号"
                  clearable
                  size="small"
                />
              </el-form-item>
              <el-form-item label="卷库状态" prop="state">
                <el-input
                  v-model="vqueryParams.state"
                  placeholder="请输入卷库状态"
                  clearable
                  size="small"
                />
              </el-form-item>
              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="mini"
                  @click="vhandleQuery"
                  >搜索</el-button
                >
                <el-button
                  icon="el-icon-refresh"
                  size="mini"
                  @click="vresetQuery"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>

            <el-table
              v-loading="vloading"
              :data="vlibraryList"
              @row-click="vrowclick($event)"
              highlight-current-row
            >
              <el-table-column type="index" width="55" align="center" />
              <el-table-column label="卷库名称" align="center" prop="name" />
              <el-table-column label="卷库编号" align="center" prop="code" />
              <el-table-column label="卷库描述" align="center" prop="other" />
              <el-table-column label="卷库状态" align="center" prop="state" />
            </el-table>

            <pagination
              v-show="vtotal > 0"
              :total="vtotal"
              :page.sync="vqueryParams.pageNum"
              :limit.sync="vqueryParams.pageSize"
              @pagination="vgetList"
            />
            <div slot="footer">
              <el-button @click="closeVolumeDialogF">取 消</el-button>
              <el-button type="primary" @click="closeVolumeDialogT"
                >确 定</el-button
              >
            </div>
          </div>
        </el-dialog>

        <!-- ---------------------- -->
        <el-dialog
          width="80%"
          title="请选择所属卷库"
          :visible.sync="volumeVisible"
          append-to-body
        >
          <div class="app-container">
            <el-form
              :model="vqueryParams"
              ref="vqueryForm"
              :inline="true"
              v-show="vshowSearch"
              label-width="68px"
            >
              <el-form-item label="课程关联id" prop="classesId">
                <el-input
                  v-model="vqueryParams.classesId"
                  placeholder="请输入课程关联id"
                  clearable
                  size="small"
                  @keyup.enter.native="vhandleQuery"
                />
              </el-form-item>
              <el-form-item label="卷库名称" prop="name">
                <el-input
                  v-model="vqueryParams.name"
                  placeholder="请输入卷库名称"
                  clearable
                  size="small"
                  @keyup.enter.native="vhandleQuery"
                />
              </el-form-item>
              <el-form-item label="卷库编号" prop="code">
                <el-input
                  v-model="vqueryParams.code"
                  placeholder="请输入卷库编号"
                  clearable
                  size="small"
                  @keyup.enter.native="vhandleQuery"
                />
              </el-form-item>
              <el-form-item label="卷库状态" prop="state">
                <el-input
                  v-model="vqueryParams.state"
                  placeholder="请输入卷库状态"
                  clearable
                  size="small"
                  @keyup.enter.native="vhandleQuery"
                />
              </el-form-item>
              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="mini"
                  @click="vhandleQuery"
                  >搜索</el-button
                >
                <el-button
                  icon="el-icon-refresh"
                  size="mini"
                  @click="vresetQuery"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>

            <el-table
              v-loading="vloading"
              :data="vlibraryList"
              @row-click="vrowclick($event)"
              highlight-current-row
            >
              <el-table-column type="index" width="55" align="center" />
              <el-table-column label="卷库名称" align="center" prop="name" />
              <el-table-column label="卷库编号" align="center" prop="code" />
              <el-table-column label="卷库描述" align="center" prop="other" />
              <el-table-column label="卷库状态" align="center" prop="state" />
            </el-table>

            <pagination
              v-show="vtotal > 0"
              :total="vtotal"
              :page.sync="vqueryParams.pageNum"
              :limit.sync="vqueryParams.pageSize"
              @pagination="vgetList"
            />
            <div slot="footer">
              <el-button @click="closeVolumeDialogF">取 消</el-button>
              <el-button type="primary" @click="closeVolumeDialogT"
                >确 定</el-button
              >
            </div>
          </div>
        </el-dialog>
        <!-- </el-col>
          <el-col :span="24"> -->
        <el-dialog
          width="80%"
          title="请选择试卷分类"
          :visible.sync="paperVisible"
          append-to-body
        >
          <div class="app-container">
            <el-form
              :model="pqueryParams"
              ref="pqueryForm"
              :inline="true"
              v-show="pshowSearch"
              label-width="68px"
            >
              <el-form-item label="名称" prop="name">
                <el-input
                  v-model="pqueryParams.name"
                  placeholder="请输入名称"
                  clearable
                  size="small"
                  @keyup.enter.native="phandleQuery"
                />
              </el-form-item>
              <el-form-item label="其他描述" prop="other">
                <el-input
                  v-model="pqueryParams.other"
                  placeholder="请输入其他描述"
                  clearable
                  size="small"
                  @keyup.enter.native="phandleQuery"
                />
              </el-form-item>
              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="mini"
                  @click="phandleQuery"
                  >搜索</el-button
                >
                <el-button
                  icon="el-icon-refresh"
                  size="mini"
                  @click="presetQuery"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>

            <el-table
              v-loading="ploading"
              :data="ppaper_typeList"
              @row-click="prowclick($event)"
              highlight-current-row
            >
              <el-table-column type="index" width="55" align="center" />

              <el-table-column label="名称" align="center" prop="name" />
              <el-table-column label=" 创建人" align="center" prop="createBy" />
              <el-table-column
                label="创建时间"
                align="center"
                prop="createTime"
                width="180"
              >
                <template slot-scope="scope">
                  <span>{{
                    parseTime(scope.row.createTime, "{y}-{m}-{d}")
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column label="修改人" align="center" prop="updateBy" />
              <el-table-column
                label="修改时间"
                align="center"
                prop="updateTime"
                width="180"
              >
                <template slot-scope="scope">
                  <span>{{
                    parseTime(scope.row.updateTime, "{y}-{m}-{d}")
                  }}</span>
                </template>
              </el-table-column>
              <el-table-column label="其他描述" align="center" prop="other" />
            </el-table>

            <pagination
              v-show="ptotal > 0"
              :total="ptotal"
              :page.sync="pqueryParams.pageNum"
              :limit.sync="pqueryParams.pageSize"
              @pagination="pgetList"
            />
            <div slot="footer">
              <el-button @click="closePaperDialogF">取 消</el-button>
              <el-button type="primary" @click="closePaperDialogT"
                >确 定</el-button
              >
            </div>
          </div>
        </el-dialog>
      </el-dialog>
    </div>
  </div>
</template>



<script>
import { listAddress } from "@/api/exam/address";
import { listCourse } from "@/api/org/course";
import {
  listExam,
  addExam,
  getExam,
  delExame,
  updateExam,
  getQueryCourseTree,
} from "@/api/exam/set";

// import {
//     listTemplate,
//   } from "@/api/paper/template";

import { listautoPaper, getautoPaperdetail } from "@/api/paper/Automatic";

import show from "./show.vue";
import { volume } from "@/assets/mixins/volume";
import { paperType } from "@/assets/mixins/paperType";

export default {
  name: "examSet",
  components: { show },
  mixins: [volume, paperType],
  data() {
    return {
      // 树数据
      Treedata: [],
      defaultProps: {
        children: "data",
        label: "courseName",
      },
      examForm: {
        pageNum: 1,
        pageSize: 10,
        // 考试期次
        periodTime: "",
        // 考试名称
        name: "",
        courseId: "",
      },
      //预览传值
      row: [],

      //预览
      showDialogVisible: false,
      // 总条数
      total: 0,
      // 考试列表多选值
      multipleSelection: [],

      // 考试列表数据
      examData: [],
      //场次数量
      num1: 1,
      // 新增考试的弹出框
      addDialogVisible: false,
      DialogVisibleTitle: "新建考试",

      // 当前新建考试所在的步骤
      addActive: 0,
      addForm: {
        //延时口令
        examPwd: "",
        // 考试名称
        name: "",
        //所属课程
        courseId: "",
        //类型
        examType: "",
        //交卷限制
        submitLimit: "",
        // 及格分数
        passingScore: "",
        //考试类型
        examType: "",

        //考试说明
        examExplain: "",
        //性质
        examNature: "",
        // 考试时长
        examDuration: "",
        // 场次信息
        sessionList: [],
        status: "",
        // 场次信息
        order: [],
        // 开考时间
        startTime: "",
        // 结束时间
        endTime: "",
        // 使用试卷
        paper: "",
        // 考试场地
        place: "",
        // 参考班级
        class: "",
        // 不参考人员
        notStaff: "",
        // 监考老师
        teacher: "",
      },
      // 考试类型数据字典
      examTypeOptions: [],
      // 考试性质数据字典
      examQuelityOptions: [],
      // 试卷选择
      paperOptions: [
        {
          value: "选项1",
          label: "试卷一",
        },
        {
          value: "选项2",
          label: "试卷二",
        },
        {
          value: "选项3",
          label: "试卷三",
        },
      ],
      // 自动组卷试卷模板
      autoTempOptions: [
        {
          value: "选项1",
          label: "试卷一",
        },
      ],
      // 是否组卷的选择
      volumeOption: [
        {
          value: 1,
          label: "是",
        },
        {
          value: 0,
          label: "否",
        },
      ],

      //课程选择
      courseList: [],
      //场地选择
      cityOptions: [],
      // 新建考试的步骤提示信息
      addText: "以下为考试安排的基本信息:",
      //表单校验
      rules: {
        examPwd: [
          { required: true, message: "延时口令不能为空", trigger: "blur" },
        ],
        name: [
          { required: true, message: "考试名称不能为空", trigger: "blur" },
        ],
        examDuration: [
          { required: true, message: "考试时长不能为空", trigger: "blur" },
        ],
        submitLimit: [
          { required: true, message: "交卷限制不能为空", trigger: "blur" },
        ],
        passingScore: [
          { required: true, message: "及格分数不能为空", trigger: "blur" },
        ],
        examNature: [
          { required: true, message: "考试性质不能为空", trigger: "blur" },
        ],
        examExplain: [
          { required: true, message: "考试说明不能为空", trigger: "blur" },
        ],
        examType: [
          { required: true, message: "考试类型不能为空", trigger: "blur" },
        ],
      },
    };
  },
  created() {
    this.creatsession();
    this.getAddressList();
    this.getList();
    this.getQueryCourseTree();
    // 获取考试类型和考试性质的字典数据
    this.getDicts("exam_type").then((response) => {
      this.examTypeOptions = response.data;
      console.log("examTypeOptions:", this.examTypeOptions);
    });
    this.getDicts("exam_quality").then((response) => {
      this.examQuelityOptions = response.data;
      console.log("examQuelityOptions:", this.examQuelityOptions);
    });
  },
  methods: {
    // //奇偶行背景色不同      //添加内容 start
    // setCurrent(row) {
    //   this.$refs.singleTable.setCurrentRow(row);
    // },
    // handleCurrentChange(val) {
    //   this.currentRow = val;
    // },
    // tableRowClassName({ row, rowIndex }) {
    //   if ((rowIndex + 1) % 2 === 0) {
    //      //return "success-row";
    //   }
    //   return "";
    // },
    //                   //添加内容 end
    getQueryCourseTree() {
      this.loading = true;
      getQueryCourseTree().then((res) => {
        this.Treedata = res;
        for (let i = 0; i < this.Treedata.length; i++) {
          if (this.Treedata[i].data != null) {
            for (let j = 0; j < this.Treedata[i].data.length; j++) {
              this.Treedata[i].data[j].data = [];
            }
          }
        }
        console.log(this.Treedata, "树");
        this.loading = false;
      });
    },

    // 树形目录点击后获取对应的学生信息
    handleNodeClick(data) {
      this.examForm = {
        pageNum: 1,
        pageSize: 10,
        // 考试期次
        periodTime: "",
        // 考试名称
        name: "",
        courseId: "",
      };
      switch (data.flag) {
        case "startingUnit": // 一级
          break;
        case "course": // 二级
          this.examForm.courseId = data.id;
          break;
        default:
          break;
      }
      /** 查询课程信息列表 */
      this.getList();
    },

    mypaperType() {
      console.log("mypaperType");
    },

    //时间戳转为日期
    formatDate(value) {
      // 时间戳转换日期格式方法
      if (value == null) {
        return "";
      } else {
        let date = new Date(value);
        let y = date.getFullYear(); // 年
        let MM = date.getMonth() + 1; // 月
        MM = MM < 10 ? "0" + MM : MM;
        let d = date.getDate(); // 日
        d = d < 10 ? "0" + d : d;
        let h = date.getHours(); // 时
        h = h < 10 ? "0" + h : h;
        let m = date.getMinutes(); // 分
        m = m < 10 ? "0" + m : m;
        let s = date.getSeconds(); // 秒
        s = s < 10 ? "0" + s : s;
        return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
      }
    },
    //选择日期
    timechange(index) {
      let templatetime = new Date(
        this.addForm.sessionList[index].startTime
      ).getTime();
      templatetime += this.addForm.examDuration * 60 * 1000;
      this.$set(this.addForm.sessionList[index], "examEndTime", new Date());
      this.addForm.sessionList[index].endTime = this.formatDate(templatetime);
      this.$forceUpdate(
        this.addForm.sessionList[index].endTime,
        this.addForm.sessionList[index].startTime
      );
    },
    // 是否自动组卷视图更新
    flagChange(index) {
      this.$forceUpdate(this.addForm.sessionList[index].flag);
      // console.log(this.addForm.sessionList[index].flag);
    },
    forceauto(index) {
      this.$forceUpdate(this.addForm.sessionList[index]);
    },
    //考试场地全选
    handleCheckAllChange(index) {
      this.addForm.sessionList[index].addressList = this.addForm.sessionList[
        index
      ].checkAll
        ? this.cityOptions
        : [];
      this.addForm.sessionList[index].isIndeterminate = false;
      //vue监听不到数组数据的变化使用this.$forceUpdate(this.addForm.sessionList[index])强制更新试图
      this.$forceUpdate(this.addForm.sessionList[index]);
    },
    //考试场地选中事件
    handleCheckedCitiesChange(data, index) {
      let checkedCount = data.length;
      this.addForm.sessionList[index].checkAll =
        checkedCount === this.cityOptions.length;
      this.addForm.sessionList[index].isIndeterminate =
        checkedCount > 0 && checkedCount < this.cityOptions.length;
      this.$forceUpdate(this.addForm.sessionList[index]);
    },
    /** 查询考场管理列表，课程列表 */
    getAddressList() {
      listAddress().then((response) => {
        this.cityOptions = response.rows;
        this.loading = false;
      });
      listCourse().then((response) => {
        this.courseList = response.rows;
        console.log(this.courseList);
      });
    },
    //获取考试列表
    getList() {
      this.loading = true;
      listExam(this.examForm).then((response) => {
        this.total = response.total;
        this.examData = response.rows;
        console.log("examData: ",this.examData);
        this.loading = false;
      });
      //获取自动组卷模板
      this.listautoPaper();

      // listTemplate().then((response) => {
      //     this.autoTempOptions = response.rows;
      //     for (let i = 0; i < this.autoTempOptions.length; i++) {
      //       this.autoTempOptions[i].paperTemplateId = this.autoTempOptions[i].id;
      //       this.autoTempOptions[i].id = null;
      //     }
      //   });
    },
    //获取自动组卷模板
    listautoPaper() {
      listautoPaper().then((response) => {
        this.autoTempOptions = response.rows;
        // for (let i = 0; i < this.autoTempOptions.length; i++) {
        //   this.autoTempOptions[i].paperTemplateId = this.autoTempOptions[i].id;
        //   this.autoTempOptions[i].id = null;
        // }
      });
    },
    //初始化sessionList
    creatsession() {
      // 使用this.$set使得新增加的属性都是响应式的数据，数据改变后可以及时触发视图更新
      this.$set(this.addForm.sessionList, 0, {
        name: "",
        addressList: [],
        isIndeterminate: false,
        checkAll: false,
        startTime: new Date(),
        endTime: new Date(),
        // 是否自动组卷
        flag: 0,
        // 自动组卷模板
        autoTempId: null,
        // 所属卷库
        volumeLibraryId: null,
        // 组卷数量
        count: null,
        // 所属试卷分类id
        paperTypeId: undefined,
        paperTypeName: undefined,
      });

      //  this.addForm.sessionList[0] = {
      //   name: "",
      //   addressList: [],
      //   isIndeterminate: false,
      //   checkAll: false,
      //   startTime: new Date(),
      //   endTime: new Date(),
      //   // 是否自动组卷
      //   flag: 0,
      //   // 自动组卷模板
      //   autoTempId: null,
      //   // 所属卷库
      //   volumeLibraryId: null,
      //   // 组卷数量
      //   count: null,
      // };
    },
    //表单重置
    restform() {
      this.addForm = {
        //延时口令
        examPwd: "",
        // 考试名称
        name: "",
        courseId: "",
        //类型
        examType: "",
        //交卷限制
        submitLimit: "",
        // 及格分数
        passingScore: "",
        //考试说明
        examExplain: "",
        //性质
        examNature: "",
        // 考试时长
        examDuration: "",
        // 场次信息
        sessionList: [],
        status: "",
        // 场次信息
        order: [],
        // 开考时间
        examStartTime: "",
        // 结束时间
        examEndTime: "",
        // 使用试卷
        paper: "",
        // 参考班级
        class: "",
        // 不参考人员
        notStaff: "",
        // 监考老师
        teacher: "",
      };

      this.num1 = 1;
      this.addActive = 0;
      this.creatsession();
    },
    //sessionListname表单嵌套刷新
    sessionListname(index) {
      this.$forceUpdate();
    },
    // 表单提交
    handDialog() {
      this.$refs["addForm"].validate((valid) => {
        if (valid) {
          if (this.addForm.id != null) {
            updateExam(this.addForm).then((response) => {
              this.msgSuccess("修改成功");
              this.addDialogVisible = false;
              this.getList();
            });
          } else {
            addExam(this.addForm).then((response) => {
              this.msgSuccess("新增成功");
              this.addDialogVisible = false;
              this.getList();
            });
          }
        }
      });
      this.restform();
    },
    //查询
    onSubmit() {
      this.getList();
    },
    //清空搜索内容
    onclear() {
      this.examForm = {
        // 考试期次
        periodTime: "",
        // 考试名称
        name: "",
      };
      this.getList();
    },
    //增加场次
    addsessionList() {
      this.num1++;

      this.$set(this.addForm.sessionList, this.num1 - 1, {
        name: "",
        addressList: [],
        isIndeterminate: false,
        checkAll: false,
        startTime: new Date(),
        endTime: new Date(),
        // 是否自动组卷
        flag: 0,
        // 自动组卷模板
        autoTempId: null,
        // 所属卷库
        volumeLibraryId: null,
        // 组卷数量
        count: null,
        // 所属试卷分类id
        paperTypeId: undefined,
        paperTypeName: undefined,
      });
      // this.addForm.sessionList[this.num1 - 1] = {
      //   name: "",
      //   addressList: [],
      //   isIndeterminate: false,
      //   checkAll: false,
      //   startTime: new Date(),
      //   endTime: new Date(),
      //   // 是否自动组卷
      //   flag: 0,
      //    // 自动组卷模板
      //   autoTempId: null,
      //   // 所属卷库
      //   volumeLibraryId: null,
      //   // 组卷数量
      //   count: null,
      // };
    },
    //删除考场
    delsessionList(index) {
      this.num1--;
      this.addForm.sessionList.splice(index, 1);
    },
    //修改功能
    changeExame(row) {
      this.restform();
      const id = row.id || this.ids;
      getExam(id).then((response) => {
        let that = this;
        setTimeout(function () {
          that.addForm = response.data;
          that.num1 = that.addForm.sessionList.length;
          for (let i = 0; i < that.addForm.sessionList.length; i++) {
            console.log("处理数组");
            // this.$set( this.addForm.sessionList[i], 'addressList', response.data.sessionList[i].addressList)
            that.$set(that.addForm.sessionList[i], "addressList", []);
            that.addForm.sessionList[i].checkAll = false;
            that.addForm.sessionList[i].isIndeterminate = false;
            // that.addForm.sessionList[i].isIndeterminate = that.addForm.sessionList[i].addressList.length > 0 && that.addForm.sessionList[i].addressList.length < that.cityOptions.length
            // if(that.addForm.sessionList[i].addressList.length==that.cityOptions.length){
            //   that.addForm.sessionList[i].checkAll=true
            //   // this.$forceUpdate(this.addForm.sessionList[i])
            // }else{
            // that.addForm.sessionList[i].checkAll=false

            // //  this.$forceUpdate(this.addForm.sessionList[i])
            // }
          }
          console.log("修改的内容", response.data);
          this.addDialogVisible = true;
          this.open = true;
          this.DialogVisibleTitle = "修改考试管理";
          console.log("修改的内容", that.addForm.sessionList);
          that.addDialogVisible = true;
          that.open = true;
          that.title = "修改考场管理";
        }, 1000);
      });
    },
    //删除功能
    deleExame(row) {
      const ids = row.id || this.ids;
      this.$confirm('是否确认删除考试编号为"' + ids + '"的数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(function () {
          return delExame(ids);
        })
        .then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    //详情
    showExame(row) {
      this.showDialogVisible = true;
      // this.DialogVisibleTitle = "预览考试管理";
      this.row = row;
      console.log("预览功能");
    },
    // 考试列表选择
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    // 新增考试
    addExam() {
      this.DialogVisibleTitle = "新增考试管理";
      this.addDialogVisible = true;
      this.restform();
    },
    // 新建考试弹窗关闭
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then((_) => {
          this.restform();
          done();
        })
        .catch((_) => {});
    },
    // 用户点击添加考试中的下一步按钮
    addnext() {
      this.addActive++;
      if (this.addActive === 0) {
        this.addText = "以下为考试安排的基本信息:";
      } else if (this.addActive === 1) {
        this.addText = "以下为考场安排相关信息:";
      } else if (this.addActive === 2) {
        this.addText = "请提点击确定交排考内容";
      }
    },
    addper() {
      this.addActive--;
      if (this.addActive === 0) {
        this.addText = "以下为考试安排的基本信息:";
      } else if (this.addActive === 1) {
        this.addText = "以下为考场安排相关信息:";
      } else if (this.addActive === 2) {
        this.addText = "请提点击确定交排考内容";
      }
    },
  },
};
</script>


<style lang="scss">
.addExam {
  margin-bottom: 8px;
}
.treeBox {
  width: 13%;
  padding-top: 20px;
  max-height: 90vh;
  overflow-y: auto;
  &::-webkit-scrollbar {
    width: 5px;
  }
  &::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: rgba(0, 0, 0, 0.2);
  }
  &::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 0;
    background: rgba(0, 0, 0, 0.1);
  }
}

.el-table .success-row {
  background: #f3f3f3;
}

.dialog-footer {
  margin-right: 50%;
  transform: translateX(-50%);
}
.neper {
  display: flex;
  margin-left: 50%;
  transform: translateX(-50%);
}
.bac {
  border-top: 1px solid #dcdfe6;
  margin-bottom: 20px;
  padding-top: 20px;

  background-color: #ebeef5;
}
</style>
